<?php Yaf\Loader::import(__DIR__.'/../head.phtml');?>
<el-main>
    <?php Yaf\Loader::import(__DIR__.'/../breadcrumb.phtml');?>
    <div class="table-list">
        <el-row>
            <el-col :span="12">
                <div class="grid-content bg-purple">
                    <el-form :model="form" :rules="rules" ref="form" :label-width="labelWidth">
                        <?php echo Building::getInstance()->renderHtml($fields,$controller)?>
                    </el-form>
                </div>
            </el-col>
            <el-col :span="12"><div class="grid-content bg-purple-light"></div></el-col>
        </el-row>

        <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitForm('form')">确 定</el-button>
        </div>
    </div>
</el-main>
<?php Yaf\Loader::import(__DIR__.'/../foot.phtml');?>
<script type="text/babel">
    var vm = new Vue({
        el: '#app',
        data:<?php echo Building::getInstance()->renderForm('form',$fields,$validate);?>,
        methods: {
            submitForm:function(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        $.post('/<?php echo $controller."/post"?>', vm.form).done(function(response) {
                            if(200 == response.code){
                                vm.form = <?php echo Building::getInstance()->renderClearForm($fields)?>;
                                vm.$message.success(response.msg);
                                let is_reload = <?php echo $reload?:0?>;
                                if(is_reload){
                                    window.location.reload();
                                }else{
                                    vm.init();
                                }
                                vm.dialog = false
                            }else{
                                vm.$message.error(response.msg);
                            }
                        })
                    } else {
                        return false;
                    }
                });
            },
            handleSuccess(response, file) {
                if(response.code == 200){
                    eval(response.data.path)
                }else{
                    vm.$message.error(response.msg);
                }
            },
            init:function (page) {
                $.post('/<?php echo $controller."/index"?>', {page:page}).done(function(response) {
                    if(200 == response.code){
                        vm.form = response.data
                    }else{
                        vm.$message.error(response.msg);
                    }
                })
            },
        },
        mounted:function () {
            this.init(0);
        },
    })
</script>